<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>文件系统-历史记录</title>
    <link rel="stylesheet" type="text/css" href="../css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="../css/history.css">
    <script th:src="@{../js/jquery-3.4.1.min.js}"></script>
    <script th:src="@{../js/jquery.fileDownload.js}"></script>
</head>
<body>
<nav class="navbar navbar-default">
    <div class="container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand active" href="#">系统功能 : </a>
        </div>
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li><a href="/file/upload">首页<span class="sr-only">(current)</span></a></li>
                <li class="active"><a href="#">历史记录</a></li>
            </ul>
        </div>
    </div>
</nav>
<!--/*@thymesVar id="Infos" type="java.util.List"*/-->
<table class="table table-bordered" style="width: 80%;" align="center" id="file_table">
    <caption>历史记录：最近10条</caption>
    <thead>
    <tr>
        <th>ID</th>
        <th>原始文件名</th>
        <th>现在文件名</th>
        <th>文件大小</th>
        <th>文件类型</th>
        <th>上传时间</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <tr class="success" th:each="fm,fmStat : ${Infos}">
        <td id="id" th:text="${fmStat.count}"></td>
        <td id="file_name" th:text="${fm['original']}"></td>
        <td id="file_now_name" th:text="${fm['fileName']}"></td>
        <td id="file_size" th:text="${fm['size']}"></td>
        <td id="file_type" th:text="${fm['type']}"></td>
        <td id="file_upload_time" th:text="${fm['createdata']}"></td>
        <td id="file_download">
            <button type="button" class="btn btn-primary" id="down_btn" th:onclick="">下载</button>
        </td>
    </tr>
    </tbody>
</table>
</body>
<script>
    var $ = $.noConflict();
    $('.success').each(function () {
        $('#down_btn' , this).click(function () {
            var url = "/file/download.do?uuid=" + $(this).parents("tr").find("#file_now_name").text();
            $.fileDownload(url, {
                httpMethod: 'GET',
                successCallback: function (url) {
                    console.log(url);
                },
                failCallback: function (req, url) {
                    var reg = /<pre.+?>(.+)<\/pre>/g;
                    req.match(reg);
                    req = RegExp.$1;
                    var json = JSON.parse(req);
                    alert(json['msg']);
                }
            });
        });
    });

</script>

</html>